<template>
  <div id="unit" class="flex-row" >
    <gas-brand-list v-ref:list :row="row" @select-changed="selected"  style="width:auto;"></gas-brand-list>
    <div  class="flex" v-el:gasbrand style="margin-left: 10px; width: 50%;" v-if="!isEmpty(val) || isChange">
      <span v-show='row'>
        <ul class="nav nav-tabs" >
          <li role="presentation" class="active"><a href="#">气表品牌相关信息</a></li>
        </ul>
        <div style="height:150px; overflow: auto;">
          <gas-model-info v-ref:update :data="row" ></gas-model-info>
        </div>
     </span>
      <add-gas-brand v-if="isChange" :data="gasmodel" v-on:toggle = "getChange"> </add-gas-brand>
    </div>
 </div>
</template>
<script>
import LoadData from '../../../../plugins/revenueService/LoadData'

export default {
  title: '气表品牌管理',
  data () {
    return {
      isChange: false,
      row: null,
      gasmodel: null
    }
  },
  methods: {
    selected (obj) {
      this.row = obj.val
      this.gasmodel = obj.val
      this.isChange = true
    },
    getChange () {
      this.isChange = true
    },
    isEmpty (value) {
      for (let name in value) {
        return false
      }
      return true
    }
  },
  events: {
    'search' () {
      this.isChange = false
      this.row = null
      this.gasmodel = {}
      this.$refs.list.$refs.paged.$refs.cri.search()
    },
    'success' (name, row, res) {
      this.isChange = false
      this.row = null
      this.gasmodel = {}
      LoadData.load()
      this.$refs.list.search()
    },
    'error' (name, row, res) {
      this.isChange = false
      this.row = null
      this.gasmodel = {}
    },
    'close' () {
      this.isChange = false
      this.row = null
      this.gasmodel = {}
      this.$refs.list.search()
    },
    'add' () {
      this.isChange = true
      this.row = null
      this.gasmodel = {}
      this.$refs.list.$refs.paged.$refs.grid.selectStore.selected = null
    }
  }
}
</script>
